<template>
  <div class="top">
    <router-link replace to="search">
      <span class="iiii">
        <van-icon name="search" />
      </span>
      <input type="text" value="搜索" replace to="search" />
      <slot></slot>
    </router-link>

  </div>
</template>

<script>

</script>

<style scoped>
* {
  text-align: center;
}

li {
  list-style: none;
}

.iiii {
  position: relative;
  left: 30%;
  color: black;
}

.top {
  width: 100%;
  height: 80px;
  background-image: url(../../public/img/banners.png);
  background-size:100%;
}

.top input {
  width: 70%;
  text-align: center;
  margin-top: 24px;
  border-radius: 12px;
  border: white;
  height: 30px;
  color: black;
  background: white;
}

.top .nav {
  display: flex;
  overflow: hidden;
  margin-top: 8px;
}

.nav ul li {
  font-size: 10px;
  padding: 0 4px;
  border-right: 1px solid rgb(212, 209, 209);
  border-bottom: 1px solid rgb(212, 209, 209);
}
</style>
